<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />
    <title>写文章</title>
    <link th:replace="blog/common::head">
    <link rel="stylesheet" th:href="@{../../../../Ui/editor/examples/css/style.css}">
    <link rel="stylesheet" th:href="@{/../../../../Ui/editor/css/editormd.css}">
    <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon"/>
</head>
<body style="background-color: #dcdcdc">

<script th:replace="blog/common::#commonjs"></script>

<div class="layui-layout layui-layout-admin">
    <div th:replace="blog/common::adminjia"></div>
    <form action="/newBlog" method="post">
        <div class="layui-body container layui-form" style="margin-top: 60px">

            <div class="row">

                <div class="col-xs-4">
                    <div class="layui-form-item ">
                        <label class="layui-form-label" style="font-size: 20px">名称</label>
                        <div class="layui-input-inline">
                            <input type="text" required name="name" lay-reqtext="文章名称是必填项，岂能为空？"
                                   placeholder="请输入" autocomplete="off" class="layui-input input" style="width: 300px">
                        </div>
                    </div>
                </div>

                <div class="col-xs-8">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="font-size: 20px">描述</label>
                        <div class="layui-input-inline">
                            <input type="text" required name="represent" lay-reqtext="文章描述是必填项，岂能为空？"
                                   placeholder="请输入" autocomplete="off" class="layui-input input" style="width: 600px">
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-xs-6">
                    <div class="row">
                        <label class="layui-form-label col-xs-3" style="font-size: 20px">分类</label>
                        <div class="layui-input-inline col-xs-9" style="width: 200px">
                            <select name="sort">
                                <option value="">请选择分类</option>
                                <optgroup label="开发">
                                    <option value="java">java</option>
                                    <option value="python">python</option>
                                    <option value="Php">Php</option>
                                    <option value="html">html</option>
                                    <option value="css">css</option>
                                </optgroup>
                                <optgroup label="其他">
                                    <option value="英语">英语</option>
                                    <option value="国语">国语</option>
                                </optgroup>
                            </select>
                        </div>
                    </div>
                </div>
                <!--用户id-->
                <input name="Bid" th:value="${session.id}" hidden>

            </div>

            <div class="row" style="margin-top: 25px">
                <div id="layout">
                    <div id="test-editormd">
                        <textarea style="display:none;margin-top: 0" name="content"></textarea>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-xs-2 col-xs-offset-4">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="margin: 0!important; font-size: 20px;font-family: 微软雅黑, Arial,serif">公开</label>
                        <div class="layui-input-block" style="margin: 0!important;padding: 0!important;">
                            <input type="checkbox" checked="" name="type" lay-skin="switch" lay-filter="switchTest" lay-text="ON|OFF" value="1">
                        </div>
                    </div>
                </div>


                <div class="col-xs-1">
                    <input type="submit" class="layui-btn layui-btn-normal" style="z-index: 999;">
                </div>
            </div>
        </div>

    </form>
</div>

<script th:src="@{/Ui/layui-v2.6.4/jquery.js}"></script>
<script th:src="@{/../../../../Ui/editor/examples/js/jquery.min.js}"></script>
<script th:src="@{/../../../../Ui/editor/editormd.min.js}"></script>
<script type="text/javascript">
    var testEditor;

    $(function () {
        testEditor = editormd("test-editormd", {
            width: "100%",
            height: 600,
            syncScrolling: "single",
            path: "../../../Ui/editor/lib/"
        });

        /*
        // or
        testEditor = editormd({
            id      : "test-editormd",
            width   : "90%",
            height  : 640,
            path    : "../lib/"
        });
        */
    });
</script>

<script>
    layui.use('upload', function () {
        var $ = layui.jquery
            , upload = layui.upload;

        //常规使用 - 普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                });

                element.progress('demo', '0%'); //进度条复位
                layer.msg('上传中', {icon: 16, time: 0});
            }
            , done: function (res) {
                //如果上传失败
                if (res.code > 0) {
                    return layer.msg('上传失败');
                }
                //上传成功的一些操作
                //……
                $('#demoText').html(''); //置空上传失败的状态
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function () {
                    uploadInst.upload();
                });
            }
        })
    });
</script>

</body>
</html>